<!-- 跟单页 -->
<template>
  <div class="bg bg1" @viewappear="viewappear" @viewdisappear="viewdisappear">

    <!--搜索栏-->
    <div class="search bg2" @click="searchClick">
      <div class="search-content bg1">
        <LImage class="search-image" :src="Config.img('sousuo.png')"></LImage>
        <text class="font24 text2">{{T('输入发起人昵称')}}</text>
      </div>
    </div>
    
    <!--菜单按钮-->
    <SubMenuOval class="menu" :menus="menus" :menu="menu" @menuClick="menuClick"></SubMenuOval>

    <!--显示界面-->
    <UTrust class="trust" v-if="menu == 0"></UTrust>
    <UFollwStrategy class="all" ref="strategy" v-else-if="menu == 1"></UFollwStrategy>
    <!-- <UFollwStrategy class="all" ref="strategy" v-if="menu == 0"></UFollwStrategy> -->
    <UFollwMan class="all" ref="man" v-else></UFollwMan>
  </div>
</template>

<script>

//组件
import SubMenuOval from '@/public/view/SubMenuOval.vue' 

import UTrust from '@/follw/UTrust.vue' 
import UFollwStrategy from '@/follw/UFollwStrategy.vue' 
import UFollwMan from '@/follw/UFollwMan.vue' 

//功能
import Config from "@/_js/config";
import navigator from "@/_js/navigator";

const weexFunction = weex.requireModule("WeexFunction");

import I18N from "@/_i18n/i18n";
var T = I18N.t;

export default {
  
  components: {
    SubMenuOval,
    UTrust,
    UFollwStrategy,
    UFollwMan,
  },

  data() {
    return {
      T: T,
      Config:Config,

      menus:[T('量化托管'), T('策略'), T('发起人')],
      menu:0,
    };
  },

  mounted() {

  },

  methods: {

    /*************************************************通信触发*/
    //完全显示
    viewappear() {
      weexFunction.logPageView('跟单', true);
      this.$refs.strategy && this.$refs.strategy.viewappear();
      this.$refs.man && this.$refs.man.viewappear();
    },

    //完全隐藏
    viewdisappear() {
      weexFunction.logPageView('跟单', false);
    },

    /********************************** 点击触发*/
    //搜索
    searchClick() {
      navigator.open('', "follw/UFollwManSearch");
    },

    menuClick(menu) {
      this.menu = menu;
    },
  },
};
</script>


<style src="@/_css/style.css"></style>
<style scoped>
.bg {
  width: 750px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

/*********************** 菜单*/
.menu {
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 30px;
}


/***********************************搜索*/
.search {
  flex-direction: row;
  align-items: center;
  width: 750px;
  height: 104px;
  padding-left: 40px;
  padding-right: 40px;
}
.search-content {
  flex-direction: row;
  align-items: center;
  width: 670px;
  height: 60px;
  border-radius: 4px;
}
.search-image {
  width: 24px;
  height: 24px;
  margin-left: 20px;
  margin-right: 20px;
}

/***********************************列表*/
.trust {
  
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}

</style>